<template>
    <div>
        <div style="display: flex;align-items: center; line-height: 45px;margin-bottom: 30px">
            <div style="width: 100px;margin-right: 10px;font-size: 14px;text-align: right;font-weight: 600;">
                部门
            </div>
            <div style="width: 100%;display: flex;flex-direction: column;justify-content: center;">
                <el-checkbox-group v-model="store.$state.SocialData.departmentChecks">
                    <el-checkbox :label="item.name" :value="item.id" v-for="item in bumendata" @change="changesearch" />
                </el-checkbox-group>
            </div>
        </div>
        <div style="display: flex;align-items: center; line-height: 45px;margin-bottom: 25px;">
            <div style="width: 100px;margin-right: 10px;font-size: 14px;text-align: right;font-weight: 600;">
                社保城市
            </div>
            <div style="width: 100%;display: flex;flex-direction: column;justify-content: center;">
                <el-checkbox-group v-model="store.$state.SocialData.socialSecurityChecks">
                    <el-checkbox :label="item.name" :value="item.id" v-for="item in Citys" @change="changesearch" />
                </el-checkbox-group>
            </div>
        </div>
        <div style="display: flex;align-items: center; line-height: 45px;">
            <div style="width: 100px;margin-right: 10px;font-size: 14px;text-align: right;font-weight: 600;">
                公积金城市
            </div>
            <div style="width: 100%;display: flex;flex-direction: column;justify-content: center;">
                <el-checkbox-group v-model="store.$state.SocialData.providentFundChecks">
                    <el-checkbox :label="item.name" :value="item.id" v-for="item in Citys" @change="changesearch" />
                </el-checkbox-group>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { useStore } from '@/stores/counter'
const store = useStore()
defineProps(['bumendata', 'changesearch', 'Citys'])
</script>

<style scoped></style>